import {Component} from "react"

let ScaleObj:Iscale={
    'c':'摄氏度',
    'f':'华氏度'
}

type Iprops ={
    scale:string
    temperature:string
    onTemperatureChange:(t:string)=>void
}

class TemperatureInput extends Component<Iprops,any> {
    handleChange = (e:React.ChangeEvent<any>) =>{
        this.setState({temperature:e.target.value})
        // console.log(e.target.value);
        this.props.onTemperatureChange(e.target.value)
        
    }
    render() {
        let {temperature,scale} = this.props
        // console.log(this.props);
        
        return(
            <fieldset>
                <legend>{ScaleObj[scale]}</legend>
                <input type="text" value={temperature} onChange={this.handleChange}/>
            </fieldset>
        )
    }
}

export default TemperatureInput